<template>
    <div  class="message-box">
        <div class="header">
            全部消息
        </div>
        <div class="contant" id="scrollDiv">
            <div class="item" v-for="(item,index) in list" :key='index'>
                <p class="time">{{item.create_time}}</p>
                <p class="message">{{item.content}}</p>
            </div>
        </div>
    </div>
</template>
<script>
export default {
  data() {
    return {
      list: [],
      page: 1, // 当前页码
      limit: 10, //每页条数
      stup: true
    };
  },
  mounted() {
    this.getMessage();
    this.scroll();
  },
  methods: {
    async getMessage() {
      var params = {
        page: this.page,
        limit: this.limit
      };
      var { data } = await this.$https.post("message/getMessageList", params);
      if (data.list.length != 0) {
        for (let i in data.list) {
          this.list.push(data.list[i]);
        }
        this.stup = true;
      } else {
        this.stup = false;
      }
    },
    scroll() {
      let _self = this;
      let scrollDiv = document.getElementById("scrollDiv");
      scrollDiv.addEventListener("scroll", function() {
        if (
          scrollDiv.scrollTop + scrollDiv.clientHeight ==
            scrollDiv.scrollHeight &&
          _self.stup
        ) {
          _self.page++;
          _self.getMessage();
        }
      });
    }
  }
};
</script>
<style lang="less" scoped>
@import url(../assets/css/message/message.less);
</style>


